<template>
  <div class="tyc-a1">
    <!-- 简介组件，上图下描述 -->
    <img :src="commessage.imgurl" />
    <!-- 描述 -->
    <div class="jianjie-des">
      <div class="des-line">{{ commessage.des }}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: "TycA1",
  props: {
    commessage: {
      type: Object,
      default: () => {
        return {
          imgurl: require("@/assets/templeone/jianjie.jpg"),
          des: "城山沟景区座落于著名的“帝乡佛国”长兴县内，东有两百余亩的桃花湖，西有千年历史文化的城山清凉禅寺，吴承恩在长兴担任县丞时就曾经到过城山沟。景区先后荣获了国家AAA级旅游景区，全国农业旅游示范点、全国休闲农业与乡村旅游示范企业、浙江省林业观光园、浙江省休闲农业与乡村旅游星级示范企业、浙江省三星级乡村旅游点、浙江省五星级农家乐、浙江省农家乐特色点等一系列荣誉。"
        };
      }
    }
  },
  data() {
    return {};
  },
  methods: {}
};
</script>

<style lang="scss" scoped>
.tyc-a1 {
  width: 100%;
  // height: 300px;
  height: 100%;
  // background-color: rgb(184, 26, 26);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  img {
    width: 293px;
    height: 118px;
    margin-bottom: 5px;
  }
  .jianjie-des {
    display: inline-block;
    width: 100%;
    text-indent: 2rem;
    height: 300px;
    font-size: 9px;
    color: aliceblue;
    overflow-y: auto;
    overflow: hidden;
    position: relative;
    .des-line {
      position: absolute;
      animation: anis 16s linear infinite;
      overflow: hidden;
      line-height: 20px;
      @keyframes anis {
        0% {
          top: 0;
        }
        25% {
          top: -25%;
        }
        50% {
          top: -50%;
        }
        70% {
          top: -85%;
        }
        100% {
          top: -120%;
        }
      }
    }
  }
}
</style>
